<!--
 * @Date: 2019-12-08 10:38:22
 * @LastEditors: 黄栋
 * @LastEditTime: 2020-04-10 16:12:34
 * @FilePath: /GIV/src/native/app/pay/success.vue
 -->
<template>
<div>
  <head title="Payment successful"></head>
  <div class="icon">
    <text class="iconfont">&#xe60d;</text>
    <text class="status">Payment successful</text>
    <div class="txtBox" v-if="raffleFlag">
      <text class="deTxt">We've sent you a lucky draw ticket,</text>
      <text
        @click="push('root:app/active/luck.js')"
        class="action"
      >you can use it to play our Lucky Roulette!</text>
    </div>
    <text class="btn" @click="returnpage">Return</text>
    <!-- <text class="btn">View orders</text> -->
  </div>
  <div class="maskClack" @click="e=>e.stopPropagation()" v-if="isLoading">
    <floading class="indicator" color="#303030"></floading>
  </div>
</div>
</template>

<script>
const navigator = weex.requireModule("navigator");
export default {
  data() {
    return {
      amount: 0,
      raffleFlag:false
    };
  },
  created() {
    var pref = weex.requireModule("storage");

    pref.getItem("raffleFlag", res => {
      if (res.result == "success") {
        if (res.data == 1) {
          this.raffleFlag = true;
        }
      }
    });
  },
  methods: {
    onLoad(param) {
      if (param && param.param) {
        return false;
      }
    },
    returnpage() {
      this.backTo("A");
    }
  }
};
</script>

<style scoped>
.icon {
  width: 750px;
  flex: 1;
  justify-content: center;
  align-items: center;
}

.iconfont {
  font-family: iconfont;
  font-size: 300px;
  color: #4ab440;
}

.status {
  color: #4ab440;
  font-size: 34px;
  margin-top: 50px;
  margin-bottom: 50px;
}
.txtBox {
  margin-bottom: 120px;
  text-align: center;
}
.deTxt {
  font-size: 25px;
}
.action {
  font-size: 26px;
  color: #4ab440;
  font-weight: 600;
  margin-top: 20px;
  line-height: 40px;
  text-decoration: underline;
}

.btn {
  width: 400px;
  height: 80px;
  line-height: 80px;
  border-radius: 80px;
  background-color: #303030;
  color: #fff;
  text-align: center;
  font-size: 30px;
  margin-top: 88px;
}
.btn:active {
  background-color: #222;
}
</style>
